<template>
  <div class="myTable">
    <el-row class="searchRow">
      <el-input style="width:200px"
                placeholder="关键字"
                prefix-icon="el-icon-search"
                class="mr15"
                v-model="keyword">
      </el-input>
      <el-button  type="success" @click="query(1)" >查询</el-button>
      <el-button  type="default" @click="clear()" >重置</el-button>
    </el-row>
    <div class="textLeft" style="padding-left: 20px">
    </div>
    <el-table :data="tableData.data" class="mt20" :show-header="true" :header-row-class-name="'tableHead'" :header-cell-class-name="'tableHeadCell'">
      <el-table-column  label="事项超期" width="120px" align="center">
        <template slot-scope="scope">
         <!-- 1 正常 2预警 5超期-->
          <span class="flagCircle" :class="scope.row.warningStatus=='1'?'green':'red'">&nbsp;&nbsp;&nbsp;</span>
        </template>
      </el-table-column>
      <el-table-column label="受理代码"  prop="processNo">  </el-table-column>
      <el-table-column label="事项名称" width="240px" prop="itemName" ></el-table-column>
      <el-table-column label="申请人" width="220px" prop="applyName" ></el-table-column>
      <el-table-column label="申请渠道" width="140px" prop="channel"></el-table-column>
      <el-table-column label="申请时间" width="200px" prop="applyDate"></el-table-column>
      <el-table-column label="是否受理" width="150px">
        <template slot-scope="scope">
          {{scope.row.processStatus==20?'已受理':'未受理'}}
        </template>
      </el-table-column>
    </el-table>
    <el-pagination @current-change="handleCurrentChange" style="margin-top: 25px"
                   layout="total,prev, pager, next" :total="tableData.rowsCount" background :page-size="tableData.pageSize"> </el-pagination>
  </div>
</template>

<script>
  export default {
    name: "eventMatter",
    data: function() {
      return {
        tableData:{},
        keyword:"",
        caseVisible:false,
        caseDetail:{}
      }
    },
    methods: {
      query: function (pageNo) {
        let vm = this;
        let data = {
          curPageNO: pageNo,
          pageSize: 10,
          keyword: vm.keyword,
          startTime: "",
          endTime: ""
        }
        this.$http.post("/yczmq/bigScreen/process/page", window.changeDataType(data)).then(resp => {
          if (resp.status == 0) {
            vm.tableData = resp.data;
          }
        })
      },
      clear() {
        this.keyword = "";
      },
      handleCurrentChange(pageNo) {
        this.query(pageNo);
      },
    },
    created(){
      this.query(1);
    }
  }
</script>

<style scoped>

</style>